.content {
	box-sizing: border-box; // 改变盒模型
	
	.header-location {
		padding-bottom: ws(15);
		margin: 0 ws(15);
		background-color: #FFFFFF;
		.locaticon {
			height: ws(40);
			background-color: #f7f7f7;
			display: flex;
			align-items: center;
			justify-content: space-between;
			box-shadow: 0 ws(1) ws(4) 0 rgba(7, 17, 27, 0.1);
			padding: 0 ws(15);
			border-radius: ws(40);
			.name {
				display: flex;
				align-items: center;
				font-size: ws(14);
				color: #666;
				.mui-icon {
					font-size: ws(20);
					margin-right: ws(10);
				}
			}
			.icon {
				color: rgba(#fff,.9);
			}
		}
	}
	
    .mui-input-row {
		margin: 0 ws(15); // 设置外边距的左右边距
		padding-bottom: ws(15); // 设置内下边距
        .textarea {	
            font-size: ws(14); //设置字体大小
			border-radius: ws(5); // 设置容器的圆角属性
            box-shadow: 0 ws(1) ws(4) 0 rgba(7, 17, 27, 0.1); // 设置容器的阴影效果
            background-color: #F7F7F7; // 设置背景颜色
			width: 100%; // 设置宽度为 100% 
			padding: ws(15); // 设置内边距
			box-sizing: border-box; // 改变盒模型
        }
    }
	.upload-pictures{
		font-size: ws(14);
		color: #666;
		padding: 0 ws(15);
		margin-bottom: ws(15);
	}
    .img-wapper {
		margin: 0 ws(15);
        display: flex;
        flex-wrap: wrap;
        .preview {
            margin-right: ws(10);
            margin-bottom: ws(10);
            height: ws(70);
            position: relative;
            image {
                width: ws(70);
                height: ws(70);
                object-fit: cover;
				box-shadow: 0 ws(1) ws(4) 0 rgba(7, 17, 27, 0.1);
				border-radius: ws(5);
            }
        }
        .delete {
            position: absolute;
            top: ws(-4);
            height: ws(15);
            width: ws(15);
            right: ws(-4);
            border-radius: 50%;
            background-color: #000;
            transform: rotate(45deg);
            &::after,
            &::before {
                margin: auto;
                content: '';
                position: absolute;
                background-color: #fff;
                top: 0;
                bottom: 0;
                right: 0;
                left: 0;
            }
            &::after {
                height: ws(1);
                width: 70%;
            }
            &::before {
                width: ws(1);
                height: 70%;
            }
        }
        .button { 
            position: relative;
			border-radius: ws(5);
            width: ws(70);
            height: ws(70);
            background-color: #F7F7F7;
            margin-right: 10px;
			box-shadow: 0 ws(1) ws(4) 0 rgba(7, 17, 27, 0.1);
            &::after,
            &::before {
                content: '';
                position: absolute;
                background: #999;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
                border-radius: ws(5);
            }
            &::after {
                width: 50%;
                height: ws(2);
            }
            &::before {
                width: ws(2);
                height: 50%;
            }
        }
    }
    .record-wapper {
        padding: ws(15);
        .record-item {
            border-radius: ws(10) ws(10) ws(10) 0;
            background-color: #F7F7F7;
            height: ws(35);
            box-shadow: 0 ws(1) ws(4) 0 rgba(7, 17, 27, 0.1);
            color: #919191;
            font-size: ws(16);
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 0 ws(15);
            margin-bottom: ws(15);
            .record-icon {
                width: ws(15);
                height: ws(15);
                margin-right: ws(15);
            }
        }
    }
}


.botton-wapper {
	position: fixed;
	bottom: 0;
    width: 100%;
    height: ws(55);
    border-top: 1px solid #eee;
    display: flex;
    align-items: center;
    z-index: 1;
    background-color: #fff;
    .botton-record {
        height: ws(40);
        margin-left: ws(15);
        flex: 1;
        text-align: center;
        line-height: ws(40);
        color: #888;
        font-size: ws(15);
        box-shadow: 0 ws(1) ws(4) 0 rgba(7, 17, 27, 0.1);
        border-radius: ws(5);
        background-color: #eee;
        display: flex;
        align-items: center;
        justify-content: center;
        .mui-icon{
            font-size: ws(20);
        }
    }
    .botton-text {
        width: ws(90);
        font-size: ws(20);
        color: #2A83FF;
        text-align: center;
    }
}



.theMatter-content {
    margin-top: ws(44);
    .title-fiexd {
        position: fixed;
        top: ws(44);
        left: 0;
        width: 100%;
        z-index: 9;
    }
    .timeTitle {
        background-color: #F6F6F6;
        padding: 0 ws(15);
        height: 50px;
        display: flex;
        align-items: center;
        font-size: ws(16);
        color: #333;
        >image {
            width: ws(25);
			height: ws(25);
            margin-right: ws(10);
        }
    }
    .item-list {
        display: flex;
        padding: 0 ws(15);
        flex-direction: column;
        justify-content: center;
        height: 70px;
        color: #000;
        .title {
            width: ws(355);
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
        .son-time {
            margin-top: ws(10);
            color: #999;
            font-size: ws(14);
        }
    }
}